<script setup lang="ts">
const props = defineProps({
  money: {
    type: Number,
    default: 0,
  },
  car: {
    type: String,
    default: '小蓝车',
  },
  modelValue: {
    type: Number,
    default: '0',
  },
})
const emit = defineEmits<{
  (e: 'update:money', newMoney: number): void
  (e: 'update:car', newCar: string): void
  (e: 'update:modelValue', newValue: Number): void
}>()

const changeMoney = () => {
  emit('update:money', props.money - 2)
}
const changeCar = () => {
  emit('update:car', '宝马车')
}
const changeScore = () => {
  emit('update:modelValue', props.modelValue + 1)
}
</script>

<template>
  <div>
    <h3>我是son 组件 - {{ money }}-{{ car }}-{{ modelValue }}</h3>
    <button @click="changeMoney">花钱</button>
    <button @click="changeCar">换车</button>
    <button @click="changeScore">加分</button>
  </div>
</template>

<style scoped></style>
